const webpack = require('webpack');
var es3ifyPlugin = require('es3ify-webpack-plugin');
const path = require('path');
const CopyPlugin = require('copy-webpack-plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const { CleanWebpackPlugin } = require('clean-webpack-plugin');
console.log(process.env.NODE_ENV + "当前环境")
const config = {
    // target: ['web', 'es5'],
    entry: './src/index.ts',
    output: {
        path: path.resolve(__dirname, './dist'),
        filename: 'js/[name].[contenthash].js',
        publicPath: "",
        libraryTarget: 'umd',
    },
    module: {
        rules: [{
                test: /\.(js|ts|tsx)$/,
                use: [

                    {
                        loader: "babel-loader"
                    },

                    {
                        loader: 'ts-loader',
                    }
                ],
                exclude: /node_modules/,
            },
            {
                test: /\.css$/,
                use: [
                    MiniCssExtractPlugin.loader,
                    {
                        loader: 'css-loader',
                        options: {
                            importLoaders: 1,
                            name: "css/[name].[hash].css",
                            modules: true
                        }
                    },
                    'postcss-loader'
                ],
                exclude: /\.module\.css$/
            },
            // {
            //     test: /\.ts(x)?$/,
            //     loader: 'ts-loader',
            //     exclude: /node_modules/
            // },
            {
                test: /\.scss$/,
                use: [
                    MiniCssExtractPlugin.loader,
                    'css-loader',
                    'sass-loader'
                ]
            },
            {
                test: /\.svg$/,
                use: 'file-loader'
            },
            {
                test: /\.(png|jpg|jpeg|gif|ico)$/,
                use: [{
                    loader: 'url-loader',
                    options: {
                        mimetype: 'image/*',
                        name: 'static/img/[name].[hash:7].[ext]'
                    }
                }]
            }
        ]
    },
    plugins: [
        /**new CopyPlugin({
            patterns: [{ from: 'src/index.html' }],
        }),**/
        // new es3ifyPlugin(),
        new HtmlWebpackPlugin({
            filename: 'index.html',
            template: "./public/index.html",
            title: "弹窗提示",
            inject: true
        }),
        new BundleAnalyzerPlugin({
            analyzerMode: 'static',
            openAnalyzer: false,
        }),
        new MiniCssExtractPlugin(),
        new CleanWebpackPlugin()
    ],
    resolve: {
        extensions: [
            '.tsx',
            '.ts',
            '.js'
        ]
    },
    optimization: {
        // runtimeChunk: 'single',
        splitChunks: {
            cacheGroups: {
                vendor: {
                    test: /[\\/]node_modules[\\/]/,
                    name: 'vendors',
                    chunks: 'all'
                }
            }
        }
    },
    devServer: {
        hot: true,
        watchOptions: {
            ignored: /node_modules/,
            poll: 2000
        },
        compress: true,
        port: 9000,


    }
};

module.exports = config;